<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>菜单列表页面</title>
		<!-- 导入jquery核心类库 -->
		<script type="text/javascript" src="../../js/jquery-1.8.3.js"></script>
		<!-- 导入easyui类库 -->
		<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/icon.css">
		<link rel="stylesheet" type="text/css" href="../../js/easyui/ext/portal.css">
		<link rel="stylesheet" type="text/css" href="../../css/default.css">
		<script type="text/javascript" src="../../js/easyui/jquery.easyui.min.js"></script>
		<script type="text/javascript" src="../../js/easyui/ext/jquery.portal.js"></script>
		<script type="text/javascript" src="../../js/easyui/ext/jquery.cookie.js"></script>
		<script src="../../js/easyui/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
		<script type="text/javascript">
            // 将form请求数据转换为json对象
            $.fn.serializeJson = function(){
                var serializeObj={};
                var array=this.serializeArray();
                var str=this.serialize();
                $(array).each(function(){
                    if(serializeObj[this.name]){
                        if($.isArray(serializeObj[this.name])){
                            serializeObj[this.name].push(this.value);
                        }else{
                            serializeObj[this.name]=[serializeObj[this.name],this.value];
                        }
                    }else{
                        serializeObj[this.name]=this.value;
                    }
                });
                return serializeObj;
            };

            $(function(){
				$("#grid").datagrid({
					toolbar : [
						{
							id : 'add',
							text : '添加菜单',
							iconCls : 'icon-add',
							handler : function(){
								location.href='menu_add.html';
							}
						},
                        {
                            id : 'update',
                            text : '修改菜单',
                            iconCls : 'icon-edit',
                            handler : doEdit
                        },
                        {
                            id : 'delete',
                            text : '删除菜单',
                            iconCls : 'icon-remove',
                            handler : doDelete
                        }
                    ],
                    pageList: [30,50,100],
                    pagination : true,
                    rownumbers : true,//数据前的行号
					url : '../../menu/findPageMenu.action',
					columns : [[{
                          field : 'id',
                          checkbox : true
					  },
					  {
						  field : 'name',
						  title : '名称',
						  width : 200
					  },  
					  {
						  field : 'description',
						  title : '描述',
						  width : 200
					  },  
					  {
						  field : 'priority',
						  title : '优先级',
						  width : 200
					  },  
					  {
						  field : 'page',
						  title : '路径',
						  width : 260
					  }
					]]
				});
			});

            function doEdit(){
                var rows = $("#grid").datagrid('getSelections');
                if(rows.length != 1){
                    $.messager.alert("警告","只能选中一条数据进行修改!","warning");
                    return false;
				}
				//获取选中的行,即第一条数据../../menu/selectMenuById.action?
				window.location.href="menu_add.html?id=" + rows[0].id;
            }

			function doDelete(){
			    var rows = $("#grid").datagrid('getSelections');
                if (rows.length == 0) {
                    // 没有选中数据
                    $.messager.alert("警告","请选中一条以上数据进行删除!","warning");
                } else {
                    // 选中数据 ，获取选中所有id ，拼接字符串方法
                    var array = new Array();
                    for(var i = 0; i < rows.length; i++) {
                        array.push(rows[i].id);
                    }

                    // 生成字符串
                    var ids = array.join(",");

                    $.get("../../menu/delete.action?ids=" + ids,function (data) {
						if(data.success){
						    //删除成功,刷新页面
                            $("#grid").datagrid( 'reload');
						}else{
						    $.messager.alert("警告",data.message,"warning");
						}
                    });
                }
			}

		</script>
	</head>

	<body class="easyui-layout">
		<div data-options="region:'center'">
			<table id="grid"></table>
		</div>
	</body>

</html>